<template>
	<view class="page">
		<!-- 销售额明细 -->
		<sales-detail :customerId="customerId"></sales-detail>
		<!-- 近一年前五大客户 -->
		<top-customer :customerId="customerId"></top-customer>
		<!-- 近一年前五大供应商 -->
		<top-supplier :customerId="customerId"></top-supplier>
		<!--近一年经营流水-->
		<revenue :customerId="customerId"></revenue>
	</view>
</template>

<script>
	import revenue from './revenue.vue';
	import salesDetail from './salesdetail.vue';
	import topSupplier from './topsupplier.vue';
	import topCustomer from './topcustomer.vue';
	export default {
		components: {
			revenue,
			salesDetail,
			topSupplier,
			topCustomer
		},
		name: 'operation',
		props: {
			customerId: {
				type: [Number, String],
				default () {
					return ''
				}
			}
		},
		data() {
			return {};
		},
		methods: {},
	}
</script>

<style lang="scss" scoped>
	.credit-box {
		background: #fff;
		padding: 24rpx;
		margin-bottom: 20rpx;

		.credit-score {
			display: flex;
			flex-direction: column;
			width: 280rpx;
			align-items: center;
			background: #e9fbff;
			border-radius: 10rpx;
			padding: 16rpx 24rpx;

			text {
				font-size: 64rpx;
				font-weight: 500;
				line-height: 1;
				margin-bottom: 10rpx;
				color: #0077ff;
			}

			view {
				font-size: 24rpx;
				color: #999;
			}
		}

		.credit-right {
			flex: 1;

			>view {
				display: flex;
				flex-direction: row;
				align-items: center;
				justify-content: flex-end;

				label {
					color: #999;
					font-size: 24rpx;
				}

				text {
					padding-left: 10rpx;
					color: #f00;
					font-size: 28rpx;
				}
			}

		}

		.credit-other {
			margin-top: 20rpx;
			background: #f7f7f7;
			padding: 10rpx;
			border-radius: 8rpx;
			font-size: 24rpx;
		}
	}
</style>